
const slider = document.getElementById('slider');
const img = slider.querySelector('img');
const images = ['img1.jpg', 'img2.jpg', 'img3.jpg','img4.jpg'];
let index = 0;

function changeImage() {
    // 在更改src之前先将图片设为透明
    img.style.opacity = 0;
    
    // 更改图片源
    img.src = images[index];
    
    // 图片加载完成后，将其恢复为完全不透明
    img.onload = function() {
        img.style.opacity = 1;
    };
    
    // 更新索引，准备下一张图片
    index = (index + 1) % images.length;
}

setInterval(changeImage, 3000);